import React, { Component } from 'react';
import ThePagination from "@/components/ThePagination";
import { Form, Input, Select, Space, Button, message, Tag, Modal, Row, Col, InputNumber, DatePicker } from "antd";
import { SearchOutlined, ExclamationCircleOutlined } from "@ant-design/icons";
import TheTable from "@/components/TheTable";
import TheButton from "@/components/TheButton";
import GoBack from '@/components/TheGoBack'
import { apiStockSupplierManageList, apiStockLibraryManageList } from '@/request/storageManager/store.js'
import { apiStockOutLibraryAdd, apiStockOutLibraryEdit, apiTSysDictionariesList, apiStockOutLibraryPrintDetail, apiStockOutLibraryView, apiStockOutLibraryConfirm, apiStockOutLibraryInfoAdd, apiStockOutLibraryInfoDel, apiStockOutLibraryInfoList, apiStockOutLibraryOrderSnapshotAdd } from '@/request/storageManager/outPut.js'
import { apiGetGoodsList, apiAdd, apiEdit, apiGetGoodsDetail, apiView } from '@/request/marketingTool'
import { exportSheetTable } from '@/utils/exportTable.js'
import { printLogo, toPrint, toPrintTool } from '@/utils/toPrint'
import { getDateTime2 } from '@/utils/getDate'
import goBack from '@/assets/icons/goBack.png'
import TheImage from "@/components/TheImage";
import './style.scss'
import store from "@/store/store"

const { Search } = Input
const { Option } = Select
const { TextArea } = Input
const { RangePicker } = DatePicker;
export default class OutPutAdd extends Component {
  constructor() {
    super()
    this.FormRef = React.createRef()
    this.addFormRef = React.createRef()
    this.subFormRef = React.createRef()
    this.state = {
      searchDataSource: [],
      columns: [
        {
          title: "序号",
          dataIndex: "index",
          key: "index",
          render: (text, record, index) => {
            return ((this.state.pageData.pageNo - 1) * (this.state.pageData.pageSize) + (index + 1));
          }
        },
        {
          title: "商品名称",
          dataIndex: "goodsName",
          key: "goodsName",

        },
        {
          title: "物料名称",
          dataIndex: "materialName",
          key: "materialName",

        },
        {
          title: "规格",
          dataIndex: "skuName",
          key: "skuName",

        },
        {
          title: "物料ID",
          dataIndex: "goodsSkuNo",
          key: "goodsSkuNo",


        },
        {
          title: "出库前库存",
          dataIndex: "beforeCount",
          key: "beforeCount",

        },
        {
          title: "出库数量",
          dataIndex: "count",
          key: "count",

        },
        {
          title: "售价",
          dataIndex: "sellPrice",
          key: "sellPrice",
          render: (text, record) => {
            return text ? '￥' + (text / 100).toFixed(2) : '-'
          }

        },
        {
          title: "操作时间",
          dataIndex: "createTime",
          key: "createTime",

        }, {
          title: "操作人",
          dataIndex: "createUserName",
          key: "createUserName",
        }, {
          title: "操作",
          fixed: 'right',
          render: (text, render, index) => {
            return <div>

              <TheButton haspermi={['storage:outPut:delInfo']} onClick={() => this.del(render, index)}>删除</TheButton>
            </div>
          }
        },
      ],
      dataSource: [],
      pageData: {
        pageNo: 1,
        pageSize: 10

      },
      total: 0,
      isModalVisible: false,
      loading: false,
      isSave: false,
      id: null,
      storeList: [],
      supplierList: [],
      code: '',
      libraryId: '',
      outLibraryId: '',
      productSku: [],
      currentSku: [],
      materialId: '',
      goodsList: [],
      options: [],
      details: [],
      status: null,
      AllLibraryId: false,
      initialValues: {
        activityName: "",
        cashierDiscountPrice: "",
        couponPrice: "",
        freight: "",
        orderCode: "",
        orderCreateTime: "",
        orderId: "",
        orderPayPrice: "",
        orderTotalPrice: "",
        voucherPrice: "",
      }
    }
  }
  componentDidMount() {
    this.setState({
      firstTypeId: this.props.match.params.firstTypeId,
      id: this.props.match.params.id,
      // dataType: "",
      AllLibraryId: this.props.match.params.type === 2 ? true : false,

    }, async () => {
      this.getOutPutList()
      this.getAllStores()
      let res = await this.getStores()
      if (!res.data || res.data.length === 0) {
        store.dispatch({
          type: 'SavePageTabValue',
          data: {
            tab: 'store'
          }
        })
        Modal.warning({
          title: '提示',
          content: '尚未创建仓库，是否立即添加仓库？',
          okText: '去添加',
          onOk: () => {
            this.props.history.push('/storageManager/store')
          }
        });
        return
      }

      if (this.state.id !== 'null') {
        this.getView()
      } else {
        this.FormRef.current.setFieldsValue({
          libraryId: this.state.storeList[0].id,
          // dataType: ""
        })
      }

    })
  }
  // 获取出入类型
  async getOutPutList() {
    let res = await apiTSysDictionariesList({ pid: this.props.match.params.firstTypeId })
    this.setState({
      options: res.data,
    })

  }
  del(row, index) {
    React.$confirm({
      title: "提示",
      type: 'warning',
      content: "确定是否删除？",
      onOk: async () => {
        let res = await apiStockOutLibraryInfoDel({
          id: row.id,
          dataType: row.dataType,
          goodsSkuId: row.goodsSkuId,
          count: row.count
        })
        if (res.code === 0) {
          let dataSource = this.state.dataSource
          dataSource.splice(index, 1)
          this.setState({
            searchDataSource: []
          }, () => {
            this.setState({
              searchDataSource: dataSource
            })
          })
          React.$message({
            type: 'success',
            content: res.codeMessage
          })
        } else {
          React.$message({
            type: 'warning',
            content: res.codeMessage
          })
        }



      }
    });

  }
  async getView() {
    let res = await apiStockOutLibraryView({ id: this.state.id })
    if (res.code === 0) {
      await this.getGoodsList(res.data.libraryId)
      this.setState({
        isSave: true,
        details: res.data,
        dataSource: this.state.dataSource.concat(res.data.infoList),
        code: res.data.code,
        outLibraryId: res.data.id,
        libraryId: res.data.libraryId,
        status: res.data.status,
        searchDataSource: this.state.dataSource.concat(res.data.infoList),
        AllLibraryId: this.props.match.params.type === '2' ? true : false,
      })
      this.FormRef.current.setFieldsValue({
        libraryId: res.data.libraryId,
        dataType: this.props.match.params.type,
        remark: res.data.remark ? res.data.remark : ' ',
        dataId: res.data.dataId,
      })
      if (res.data.status === 1 || [0, 1, 4, 5].includes(res.data.dataType)) {
        let columns = this.state.columns
        columns.pop()
        this.setState({
          columns: []
        }, () => {
          this.setState({
            columns: columns
          })
        })
      }
      // 已提交状态显示金额列
      if (res.data.status === 1 && [0, 1, 4, 5].includes(res.data.dataType)) {
        let columns = this.state.columns
        columns.splice(4, 0,
          {
            title: "金额",
            dataIndex: "unitPrice",
            key: "unitPrice",
            render: (text, record) => {
              return record.unitPrice >= 0 ? ((record.unitPrice) / 100).toFixed(2) : "-"
            }
          }
        )
        this.setState({
          columns: []
        }, () => {
          this.setState({
            columns: columns
          })
        })
      }
    }
  }
  async getGoodsList(libraryId) {
    let res = await apiGetGoodsList({ libraryId, type: 1 })
    if (res.code === 0) {
      this.setState({
        goodsList: res.data,
      })
    }
  }
  selectFilter(input, option) {
    const materialIds = option.option.materialIds.toLowerCase().split(',')
    const result = option.children.toLowerCase().includes(input.toLowerCase()) || materialIds.includes(input.toLowerCase())
    return result
  }
  goodsChange(e, row) {
    this.apiGetGoodsDetail(e)
  }
  async apiGetGoodsDetail(goodsId, skuId) {
    let res = await apiGetGoodsDetail({ goodsId, libraryId: this.state.libraryId })
    if (res.code === 0) {
      if (this.state.materialId) {
        let result = res.data.skuInfo.filter(item => item.materialId === this.state.materialId)
        this.setState({
          productSku: res.data,
          currentSku: result.length > 0 ? result[0] : res.data.skuInfo[0]
        })
      } else {
        this.setState({
          productSku: res.data,
          currentSku: res.data.skuInfo[0]
        })
      }

    }
  }
  // 获取供应商list
  async getSuppliers() {
    let res = await apiStockSupplierManageList()
    if (res.code === 0) {

      this.setState({
        supplierList: res.data
      })
    }
  }
  // 获取仓库list
  async getStores() {
    let res = await apiStockLibraryManageList({ isOutsource: 1})
    if (res.code === 0) {
      this.setState({
        storeList: res.data
      })
    }
    return res
  }
  async getAllStores() {
    let res = await apiStockLibraryManageList({ dataId: -1 })
    if (res.code === 0) {

      this.setState({
        allStoreList: res.data
      })
    }
    return res
  }
  pageChange = (pageNo, pageSize) => {
    this.setState({
      pageData: {
        pageNo, pageSize
      }
    }, () => {
      this.getData()
    })
  };
  triggerSkuTag(row) {

    this.setState({
      currentSku: row
    })
  }
  async onFinishAdd(values) {
    console.log(values);
    let { outLibraryId, currentSku, productSku, code } = this.state
    if (currentSku.libraryGoodsId == 0) {
      React.$message({
        type: 'warning',
        content: '当前商品尚未入库，请出库后执行此操作！'
      })
      return
    }
    let res = await apiStockOutLibraryInfoAdd({
      outLibraryId: outLibraryId,
      goodsId: values.goodsId,
      goodsSkuId: currentSku.SKUId,//skuId
      libraryGoodsId: currentSku.libraryGoodsId,//
      code: code,
      count: values.nowCount,//盘点库存
      beforeCount: currentSku.stock,//当前库存
      goodsName: productSku.goodsInfo.goodsName,
      sellPrice: values.sellPrice * 100
    })
    if (res.code === 0) {
      message.success(res.codeMessage);
      this.reset()
      this.setState({
        dataSource: this.state.dataSource.concat(res.data),
        searchDataSource: this.state.dataSource.concat(res.data),
        isModalVisible: false
      })

    }
  }
  onFinishSearch() { }

  handleCancel() { }
  saveOutPutOrder = () => {
    let values = this.FormRef.current.getFieldsValue()
    if (values.dataType == undefined) {
      message.error('出库类型不能为空！');
    } else {
      Modal.confirm({
        title: '提示',
        icon: <ExclamationCircleOutlined />,
        content: '保存出库单后将不可修改，确定保存出库单吗？',
        okText: '确认',
        cancelText: '取消',
        onOk: async () => {
          let values = this.FormRef.current.getFieldsValue()
          let res = await apiStockOutLibraryAdd({
            libraryId: values.libraryId,
            dataType: values.dataType,
            remark: values.remark ? values.remark : '',
            dataId: values.dataId ? values.dataId : ""
          })
          if (res.code === 0) {
            this.getGoodsList(values.libraryId)
            this.setState({
              isSave: true,
              code: res.data.code,
              outLibraryId: res.data.id,
              libraryId: values.libraryId,
              dataId: res.data.dataId,
            })
            this.props.history.push('/outPutManager/salesOutPut/add/' + res.data.id + '/' + values.dataType + '/1603275570733678594')
          }

        }
      });
    }

  }
  reset() {
    this.addFormRef.current.setFieldsValue({
      nowCount: null,
      goodsId: '',
      dataType: '',
      sellPrice: null
    })
    this.setState({
      productSku: {},
      currentSku: {}
    })
  }
  subReset() {
    this.subFormRef.current.setFieldsValue({
      activityName: "",
      cashierDiscountPrice: "",
      couponPrice: "",
      freight: "",
      orderCode: "",
      orderCreateTime: "",
      orderId: "",
      orderPayPrice: "",
      orderTotalPrice: "",
      voucherPrice: "",
    })
  }
  async onFinishSub(values) {
    let data = {}
    data.activityName = values.activityName ? values.activityName : ""
    data.cashierDiscountPrice = values.cashierDiscountPrice ? (values.cashierDiscountPrice * 100).toFixed(0) : ""
    data.couponPrice = values.couponPrice ? (values.couponPrice * 100).toFixed(0) : ""
    data.freight = values.freight ? (values.freight * 100).toFixed(0) : ""
    data.orderCode = values.orderCode ?? ""
    // data.orderId= values.orderId??""
    data.orderPayPrice = values.orderPayPrice ? (values.orderPayPrice * 100).toFixed(0) : ""
    data.orderTotalPrice = values.orderTotalPrice ? (values.orderTotalPrice * 100).toFixed(0) : ""
    data.voucherPrice = values.voucherPrice ? (values.voucherPrice * 100).toFixed(0) : ""
    data.orderCreateTime = values.orderCreateTime ? getDateTime2(values.orderCreateTime) : ''
    console.log(data);
    let res = await apiStockOutLibraryOrderSnapshotAdd({ outLibraryId: this.state.outLibraryId, ...data })
    if (res.code === 0) {
      let request = await apiStockOutLibraryConfirm({ "id": this.state.outLibraryId, })
      if (request.code === 0) {
        React.$message({
          type: 'success',
          content: request.codeMessage
        })
        this.setState({
          fromvisible: false
        })
        this.props.history.push("/outPutManager/salesOutPut")
      }
    }
  }
  execute() {
    const { outLibraryId } = this.state
    React.$confirm({
      title: "提示",
      type: 'warning',
      content: "是否确定操作？",
      onOk: async () => {
        this.setState({
          fromvisible: true
        })
        // let res = await apiStockOutLibraryConfirm({
        //     "id": outLibraryId,
        // })
        // if (res.code === 0) {
        //     React.$message({
        //         type: 'success',
        //         content: res.codeMessage
        //     })
        //     setTimeout(() => {
        //         this.props.history.push("/outPutManager/salesOutPut")
        //     }, 2000);
        // }
      }
    })

  }
  exportGoodsDetail() {
    const th_arr = [
      {
        title: `出库单详情(单号：${this.state.code})`,
        prop: '',
        children: [
          {
            title: '商品名称',
            prop: 'goodsName',
          },
          {
            title: '物料名称',
            prop: 'materialName'
          },
          {
            title: '规格',
            prop: 'skuName',
          },
          {
            title: "物料ID",
            prop: "goodsSkuNo",
          },
          {
            title: '出库前库存',
            prop: 'beforeCount',
            valueType: 'number'
          },
          {
            title: '入库数量',
            prop: 'count',
            valueType: 'number'
          },
          {
            title: '操作时间',
            prop: 'createTime',
          },
          {
            title: '操作人',
            prop: 'createUserName',
          }

        ]
      },

    ]
    let tb_arr = this.state.dataSource
    exportSheetTable({ fileName: `出库单详情(单号：${this.state.code})`, tH_data: th_arr, tB_data: tb_arr, isSheet: true, merge: false, })
  }
  onBlur = (materialId) => {
    this.setState({
      materialId
    })
  }
  OptionChange = (value) => {
    value === "2" ?
      this.setState({
        AllLibraryId: true
      }) :
      this.setState({
        AllLibraryId: false
      })
  }
  setSearchValue = (value) => {
    const { dataSource } = this.state
    let search = value.target.value.trim()
    if (search) {
      this.setState({
        searchDataSource: this.getSearchData(dataSource, search)
      })
    } else {
      this.setState({
        searchDataSource: this.state.dataSource
      })
    }
  }
  getSearchData(aim, searchVal) {
    let newArr = []
    for (var i = 0; i < aim.length; i++) {
      let value = aim[i].goodsName, value1 = aim[i].goodsSkuNo, value2 = aim[i].materialName
      if (value.includes(searchVal) || value1.includes(searchVal) || value2.includes(searchVal)) {
        newArr.push(aim[i]);//将值放入第二个数组
      }
    }
    return newArr
    // return aim.filter(item => item.goodsName == goodsName)
  }
  //打印
  billPrint = async () => {
    const res = await apiStockOutLibraryPrintDetail({ id: this.state.id })
    if (res.code === 0) {
      const data = res.data.stockOutLibraryInfoPrintVoList
      let resultData = [], countTotal = 0, payTotal = 0
      data.forEach((item, index) => {
        item.sort = index + 1
        countTotal += item.count
        payTotal += Number(item.totalPrice) ? Number(item.totalPrice) : 0
        item.totalPrice = (item.totalPrice / 100).toFixed(2)
        item.unitPrice = (item.unitPrice / 100).toFixed(2)
        resultData.push(item)
        if (index === data.length - 1) {
          resultData.push({
            materialId: '合计',
            count: countTotal,
            totalPrice: payTotal ? (payTotal / 100).toFixed(2) : '0'
          })
        }
      })
      toPrintTool(
        [
          {
            th: [
              { label: '序号', value: 'sort', width: '4%' },
              { label: '物料编码', value: 'materialId', width: '15%' },
              { label: '物料名称', value: 'materialName', width: '30%', align: 'start' },
              { label: '规格型号', value: 'skuStr', width: '9%' },
              { label: '数量', value: 'count', width: '4%' },
              { label: '单价', value: 'unitPrice', width: '7%' },
              { label: '金额', value: 'totalPrice', width: '7%' },
              { label: '仓库', value: 'libraryName', width: '7%' },
              { label: '备注', value: 'skuDescription', width: '17%', align: 'start' },
            ],
            title: res.data.tableName,
            data: resultData,
            remark: res.data.remark ?? '',
            infos: [
              { label: '仓库名称', value: res.data.libraryName },
              { label: '出库时间', value: res.data.outLibraryTime },
              { label: '出库单号', value: res.data.code },
              { label: '对应单号', value: res.data.dataCode },
              { label: '快递公司', value: res.data.courierName ?? '哈奇马自配送' },
              { label: res.data.courierNo ? '快递单号' : '配送员', value: res.data.courierNo ?? res.data.deliverymanName },
              // { label: '备注', value: res.data.remark },
            ],
            tfoot: {
              '配货时间': '',
              '发货人': '',
              '复核人': '',
              '审核人': '',
            }
          }
        ]
      )
    }
  }
  render() {
    let { columns, fromvisible, supplierList, initialValues, searchDataSource, status, goodsList, outLibraryId, details, options, storeList, productSku, currentSku, dataSource, pageData, total, isModalVisible, loading, isSave, AllLibraryId, allStoreList } = this.state
    console.log(this.props.history);
    return (
      <div className="p-layout-box">
        <header className='go-back-header'>
          <div onClick={() => this.props.history.push("/outPutManager/salesOutPut")}
            style={{ display: 'flex', alignItems: 'center' }}>
            <TheImage preview={false} width={22} src={goBack} />
          </div>
          <div className={'go-back-title'}>新增出库管理</div>
        </header>
        <Form layout={'inline'} ref={this.FormRef} onFinish={this.onFinishSearch} style={{ marginBottom: 12, marginTop: 12 }}>

          <Form.Item name={"libraryId"}>
            <Select disabled={outLibraryId} style={{ width: 200 }} placeholder={"出库仓库"}>
              {
                storeList.map((item, index) => {
                  return <Option value={item.id} key={index}>{item.name}</Option>
                })
              }

            </Select>
          </Form.Item>

          <Form.Item
            name="dataType"

          >
            <Select required disabled={outLibraryId} style={{ width: 200 }} placeholder={"出库类型"} onChange={(e) => this.OptionChange(e)}>
              {
                options.map((item, index) => {
                  return <Option disabled={item.isDefault === 0 ? true : false} value={item.value} key={index}>{item.name}</Option>
                })
              }

            </Select>
          </Form.Item>
          {AllLibraryId &&
            <Form.Item name={"dataId"}>
              <Select disabled={outLibraryId} style={{ width: 200 }} placeholder={"调拨仓库"}>
                {
                  allStoreList.map(item => {
                    return <Option value={item.id}>{item.name}</Option>
                  })
                }

              </Select>
            </Form.Item>
          }
          <Form.Item name={"remark"}>
            <TextArea disabled={outLibraryId} autoSize={false} rows={1} style={{ width: 340 }} maxLength={300} placeholder={"备注"} />
          </Form.Item>
          <Space direction="vertical">
            <Search
              placeholder="请输入物品名称/物料ID"
              onChange={(e) => this.setSearchValue(e)}
              style={{
                width: 200,
              }}
              allowClear
            />
          </Space>
          <Space style={{ marginLeft: 12 }}>
            <TheButton onClick={() => this.exportGoodsDetail()} haspermi={['storage:outPut:exportGoodsDetail']} size="middle" type="default">导出</TheButton>
            {
              details.finishTime == null ? null : <TheButton haspermi={['storage:outPut:print']} onClick={this.billPrint} size="middle" type="default">打印</TheButton>
            }
          </Space>
        </Form>
        {
          status !== 1 && ![0, 1, 4, 5].includes(details.dataType) ? <div style={{ marginBottom: 12 }}>
            {
              !isSave ?
                <TheButton onClick={() => this.saveOutPutOrder()} haspermi={['storage:outPut:saveOutPutOrder']} size="middle" type="primary">保存出库单</TheButton>
                :
                <div>
                  {/* <TheButton style={{ marginRight: 8 }} haspermi={['storage:putIn:upload']} size="middle" type="default">导入</TheButton>
                                <TheButton style={{ marginRight: 8 }} haspermi={['storage:putIn:downLoad']} size="middle" type="default">导出</TheButton> */}
                  <TheButton onClick={() => this.setState({ isModalVisible: true })} haspermi={['storage:outPut:addInfo']} size="middle" type="primary">添加商品</TheButton>
                </div>
            }
          </div> : null
        }

        <TheTable
          scroll={{ x: "max-content", y: '63vh' }}
          columns={columns}
          dataSource={searchDataSource}
        />
        {
          (status !== 1 && ![0, 1, 4, 5].includes(details.dataType)) ? <div style={{ textAlign: 'center', marginTop: 12 }}>
            {
              dataSource.length > 0 &&
              <TheButton type="primary" haspermi={['storage:outPut:execute']} size='middle' onClick={() => this.execute(1)}>提交</TheButton>

            }
          </div> : null
        }
        <Modal title="新增" visible={isModalVisible} width="40%"

          onCancel={() => this.setState({ isModalVisible: false })}
          footer={null}
        >
          <Form
            labelCol={{
              span: 4,
            }}
            wrapperCol={{
              span: 16,
            }}
            ref={this.addFormRef}
            onFinish={(values) => this.onFinishAdd(values)}
          >
            <Row>

              <Col span={24}>
                <Form.Item

                  label="选择商品"
                  name="goodsId"
                  rules={[
                    {
                      required: true,
                      message: '请选择商品!',
                    },
                  ]}
                >
                  <Select

                    showSearch
                    optionFilterProp="children"
                    filterOption={(input, option) => this.selectFilter(input, option)}
                    style={{
                      width: '100%',
                    }}
                    onSearch={(e) => this.onBlur(e)}
                    onSelect={(e, obj) => this.goodsChange(e, obj)}
                    placeholder="请选择商品"
                  >
                    {
                      goodsList.map(item => <Option option={item} key={item.goodsId} value={item.goodsId}>{item.goodsName}</Option>)
                    }
                  </Select>

                </Form.Item >
              </Col>

              <Col>
                {
                  productSku.hasOwnProperty('goodsInfo') ?
                    <Form.Item
                      wrapperCol={{
                        offset: 4,
                        span: 16,
                      }}
                    >
                      <div className='goodsDesc'>
                        <div className='info'>
                          <img src={currentSku.imageFile ? currentSku.imageFile.split(',')[0] : ''} alt="商品图片" className='goodsImg' />
                          <div className="goodsInfo">
                            <div className='name'>{productSku.goodsInfo.goodsName}</div>
                            <div className='stock'>
                              物料名称：{currentSku.materialName}
                            </div>
                            <div className='stock' >
                              物料ID：{currentSku.materialId}
                            </div>
                            <div className='stock' >
                              可售库存：{currentSku.stock}
                            </div>
                            <div className='stock' >
                              待出库存：{currentSku.waiteOutCount}
                            </div>
                            <div className='stock' >
                              实际库存：{currentSku.realStock}
                            </div>
                          </div>
                        </div>
                        <div className='goodsSku'>
                          {
                            productSku.skuInfo.map(item =>
                              <Tag className='tag' key={item.SKUId} color={item.SKUId === currentSku.SKUId ? "cyan" : ''} onClick={() => this.triggerSkuTag(item)}>
                                {item.skuAttribute.map(item2 => item2.value).join(',')}
                              </Tag>
                            )
                          }

                        </div>
                      </div>
                    </Form.Item> : null
                }
              </Col>


              <Col span={24}>
                <Form.Item
                  label="出库数"
                  name="nowCount"
                  rules={[
                    {
                      required: true,
                      message: '请输入!',
                    },
                  ]}
                >
                  <InputNumber style={{
                  }} precision={0} min={0} />
                </Form.Item>
              </Col>
              <Col span={24}>
                <Form.Item
                  label="售价"
                  name="sellPrice"
                  rules={[
                    {
                      required: true,
                      message: '请输入!',
                    },
                  ]}
                >
                  <InputNumber style={{
                  }} precision={0} min={0} />
                </Form.Item>
              </Col>
              <Col>
                <Form.Item wrapperCol={{
                  offset: 8,
                  span: 16,
                }}>
                  <Space size="small" style={{ marginLeft: 10 }}>

                    <Button type="default" onClick={() => this.reset()}>
                      重置
                    </Button>
                    <Button type="primary" htmlType="submit">
                      确定
                    </Button>
                  </Space>
                </Form.Item>
              </Col>
            </Row>
          </Form>
        </Modal>
        <Modal visible={fromvisible} title={details.dataTypeName} onCancel={() => this.setState({ fromvisible: false })} footer={null}>
          <Form ref={this.subFormRef} labelCol={{ span: 6, }} wrapperCol={{ span: 18, }}
            onFinish={(values) => this.onFinishSub(values)} initialValues={initialValues}>
            {/* <Form.Item label="订单ID" name={'orderId'} >
                            <Input />
                        </Form.Item> */}
            <Form.Item label="订单日期" name={'orderCreateTime'} >
              <DatePicker style={{ width: '100%' }} showTime allowClear={false} format={'YYYY-MM-DD HH:mm:ss'} />
            </Form.Item>
            <Form.Item label="订单号" name={'orderCode'} >
              <Input onPressEnter={(e)=>{e.preventDefault()}} />
            </Form.Item>
            <Form.Item label="订单金额" name={'orderTotalPrice'} >
              <InputNumber precision={2} min={0} onPressEnter={(e)=>{e.preventDefault()}} />
            </Form.Item>
            <Form.Item label="订单活动" name={'activityName'} >
              <Input onPressEnter={(e)=>{e.preventDefault()}} />
            </Form.Item>
            <Form.Item label="代金券金额" name={'voucherPrice'} >
              <InputNumber precision={2} min={0} onPressEnter={(e)=>{e.preventDefault()}} />
            </Form.Item>
            <Form.Item label="折扣券金额" name={'couponPrice'} >
              <InputNumber precision={2} min={0} onPressEnter={(e)=>{e.preventDefault()}} />
            </Form.Item>
            <Form.Item label="收银台折扣金额" name={'cashierDiscountPrice'} >
              <InputNumber precision={2} min={0} onPressEnter={(e)=>{e.preventDefault()}} />
            </Form.Item>
            <Form.Item label="实付金额" name={'orderPayPrice'} >
              <InputNumber precision={2} min={0} onPressEnter={(e)=>{e.preventDefault()}} />
            </Form.Item>
            <Form.Item label="运费金额" name={'freight'} >
              <InputNumber precision={2} min={0} onPressEnter={(e)=>{e.preventDefault()}} />
            </Form.Item>
            <Form.Item align={'center'}>
              <Space>
                <Button type="default" onClick={() => this.subReset()}>
                  重置
                </Button>
                <Button type="primary" htmlType="submit">
                  确定
                </Button>
              </Space>
            </Form.Item>
          </Form>
        </Modal>
      </div>
    );
  }
}
